/**
 * Get elements by custom attribute
 * @param {string} attr - The attribute name
 * @param {string} value - The attribute value
 * @param {Element} context - The context element (optional)
 * @returns {Element[]} Array of matched elements
 */
function getElementsByAttribute(attr, value, context = document) {
    // Use querySelectorAll with attribute selector
    return Array.from(context.querySelectorAll(`[${attr}="${value}"]`));
}

// Example usage:
// Get elements with data-custom="example"
// const elements = getElementsByAttribute('data-custom', 'example');

// Get elements within specific context
// const parentEl = document.getElementById('parent');
// const elements = getElementsByAttribute('data-custom', 'example', parentEl);

/**
 * Hide elements by setting visibility to hidden
 * @param {Element[]} elements - Array of elements to hide
 */
function hideElements(elements) {
    elements.forEach(el => el.style.visibility = 'hidden');
}

/**
 * Show elements by setting visibility to visible
 * @param {Element[]} elements - Array of elements to show
 */
function showElements(elements) {
    elements.forEach(el => el.style.visibility = 'visible');
}